<template>
    <div>
    <HomeView></HomeView>
    <div class="order">
        <el-table
            :data="table"
            style="width: 100%">
            <el-table-column
        
                prop="orderKey"
                label="订单号"
                width="180">
            </el-table-column>
            <el-table-column
        
                prop="status"
                label="状态"
                width="180">
            </el-table-column>
            <el-table-column
        
                prop="date"
                label="日期"
                width="180">
            </el-table-column>
            <el-table-column
            
                prop="carKey"
                label="车辆号"
                width="180">
            </el-table-column>
            <el-table-column
            
                prop="time"
                label="租车天数">
            </el-table-column>
            <el-table-column

                prop="amount"
                label="金额">
            </el-table-column>
            <el-table-column
                v-if="table.orderKey"
                prop="custKey"
                label="顾客号">
            </el-table-column>
            <el-table-column
                    fixed="right"
                    label="操作"
                    width="100">
                    <template slot-scope="scope">
                        <el-button @click="del(scope.row.id)" type="text" size="small">删除</el-button>
                        <el-button type="text" size="small" @click="update(scope.row.id)">通过</el-button>
                    </template>
                    </el-table-column>
                    <el-dialog title="订单信息" :visible.sync="dialogVisible" width="30%">
                    <el-form ref="form" :model="table" label-width="80px">
                        
                        <el-form-item label="订单号">
                        <el-input v-model="table.orderKey"></el-input>
                        </el-form-item>
                        <el-form-item label="身份证">
                        <el-input v-model="table.idCard"></el-input>
                        </el-form-item>
                        <el-form-item label="昵称">
                        <el-input v-model="table.uname"></el-input>
                        </el-form-item>
                        <el-form-item label="电话">
                        <el-input v-model="table.phone"></el-input>
                        </el-form-item>
                        <el-form-item label="地址">
                        <el-input v-model="table.address"></el-input>
                        </el-form-item>
                    </el-form>
                    <span slot="footer" class="dialog-footer">
                        <el-button @click="dialogVisible = false">取 消</el-button>
                        <el-button type="primary" @click="add">确 定</el-button>
                    </span>
                    </el-dialog>
            </el-table>
            <el-button style="float: right; padding: 3px 0" type="text" @click="Naw">刷新</el-button>



    </div>
</div>


</template>

<script>
import HomeView from '@/views/HomeView.vue'
export default{
    data(){
        return {
            table:[{}]
        }
    },

    methods:{
      add(){
                this.dialogVisible = true
                this.$axios.post('/orders/addOrders',{
                    license:this.table.orderKey,
                    idCard:this.table.idCard,
                    uname:this.table.uname,
                    price:this.table.price,
                    address:this.table.address,
                    color:this.table.color,
                    brand:this.table.brand
                },{
                    headers:{
                        "token":JSON.parse(localStorage.getItem('user')).token
                    }
                })
                .then(res=>{
                    if(res.data.msg=='success'){
                        alert("新增成功")
                    }
                    else{
                        alert("新增失败")
                    }
                })
                this.dialogVisible=false
            },

        del(id){
            var order = this.table[id]
            this.$axios.post('/orders/deleteOrders',{
                orderKey:order.orderKey
            },{
              headers:{
                "token":JSON.parse(localStorage.getItem('user')).token
              } 
              }
            )
        },
        Naw(){
          this.$axios.post('/orders/orderList',{},{
              headers:{
                "token":JSON.parse(localStorage.getItem('user')).token
              } 
              })
        .then(response =>{
                this.form = response.data.data;
                
                    this.table=this.form
                    for(let i=0;i<this.table.length;i++){
                      this.table[i].id = i
                    }
                console.log(this.table.id)
            })

            
        },
        update(id){
          var order = this.table[id]
          this.$axios.post('/orders/updateOrders',{
            orderKey:order.orderKey,
            status:'0'
          },
          {
            headers:{
              "token":JSON.parse(localStorage.getItem('user')).token
            }
          })
          .then(res=>{
            if(res.data.msg=="success"){
              alert("通过 成功")
              this.$router.go(0)
            }
            else{
              alert("通过失败")
            }
          })
        }

    },
    components:{
        HomeView
    },

    created(){

        this.$axios.post('/orders/orderList',{},{
              headers:{
                "token":JSON.parse(localStorage.getItem('user')).token
              } 
              })
        .then(response =>{
                this.form = response.data.data;
                
                    this.table=this.form
                    for(let i=0;i<this.table.length;i++){
                      this.table[i].id = i
                      if(this.table[i].status==1){
                          this.table[i].status = "已提交"
                        }
                        else if(this.table[i].status==0){
                          this.table[i].status = "已通过"
                        }
                        else if(this.table[i].status==2){
                          this.table[i].status = "申请退款"
                        }
                    }
                console.log(this.table.id)
            })

    }

}
</script>

<style>
  .text {
    font-size: 14px;
  }

  .item {
    margin-bottom: 18px;
  }

  .clearfix:before,
  .clearfix:after {
    display: table;
    content: "";
  }
  .clearfix:after {
    clear: both
  }

  .box-card {
    width: 480px;
  }
</style>